<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>雨果音乐</title>
  <!-- Load FontAwesome icons -->
  <link rel="stylesheet" href="./css/style.css">
  <link rel="stylesheet" href="css/yuguo_music.css">
</head>

<body>
  <!-- <h2>雨果音乐</h2> -->
  <div class="player">
    <!-- 播放动画 -->
    <div class="play-poster">
        <div class="strip-box ">
          <img src="image/needle-ip6.png" alt="图1">
        </div>
        <!-- 转盘 -->
        <div class="poster-box pause">
          <div class="play-box">
             <img src="image/109951165044543784.jpg" alt="图2">
          </div>
        </div>
    </div>

    <!-- <i class="fa fa-angle-double-right fa-3x"></i> -->
    <!-- <i class="fa fa-angle-double-left fa-5x"></i> -->

    <div class="play-controller">
      <!-- 播放、暂停控制 -->
      <div class="play" onclick="onPlayAndPause()">
        <span class="icon-play2"></span>
      </div>
      <!-- 播放进度 -->
      <div class="play-time">
        <span class="start-time">00:00</span>
        <input class="seek-input" type="range" min="1" max="100" value="0" onchange="seekTo()" />
        <span class="end-time">00:00</span>
      </div>
    </div>
  </div>
  <script src="js/jquery-3.4.1.js"></script>
  <script src="js/yuguo_music.js"></script>
</body>

</html>